Navigation

<div class="navbar navbar-default text-center">
  <div class="navleft">
    <button class="btn btn-default navbar-btn"><i class="fa fa-angle-left"></i></button>
  </div>
  <h4>Title</h4>
  <div class="navright">
    <button class="btn btn-default navbar-btn"><i class="fa fa-bell"></i>
      <span class="badge">4</span>
    </button>
    <button class="btn btn-default navbar-btn"><i class="fa fa-power-off"></i></button>
  </div>
</div>

<div class="navbar navbar-default navbar-inverse">
  <!--.navleftbutton.btn.btn-default.navbar-btn
  i.fa.fa-angle-left-->
  <span class="navbar-brand">Title</span>
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Link </a></li>
    <li><a href="#">Link </a></li>
    <li class="dropdown"><a href="#" id="menudropdown" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" class="dropdown-toggle">Dropdown<span class="caret"></span></a>
      <ul class="dropdown-menu">
        <li> <a href="#">Action</a></li>
        <li> <a href="#">Another action</a></li>
        <li> <a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li> <a href="#">Separated link</a></li>
        <li class="divider"></li>
        <li> <a href="#">One more separated link</a></li>
      </ul>
    </li>
  </ul>
  <div class="navright">
    <button class="btn btn-default navbar-btn"><i class="fa fa-bell"></i>
      <span class="badge">4</span>
    </button>
    <button class="btn btn-default navbar-btn"><i class="fa fa-power-off"></i></button>
  </div>
</div>